<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                template="/templates/plantilla1.xhtml">

    <ui:define name="contenido">

        <style type="text/css">

            .verticalText {
                text-align: center;
                vertical-align: middle;
                width: 20px;
                margin: 0px;
                padding: 0px;
                padding-left: 3px;
                padding-right: 3px;
                padding-top: 10px;
                white-space: nowrap;
                -webkit-transform: rotate(-90deg);
                -moz-transform: rotate(-90deg);
            }

        </style>


        <h:form>
            <div class="ui-datatable">
                <div class="ui-datatable-tablewrapper">

                    <table>
                        <thead>
                            <tr style="height: 113px;">
                                <th class="ui-state-default" style="width: 60px;">
                                    <div class="verticalText">Filas</div>
                                </th>
                                <c:forEach items="#{tablaTestBean.titulos}" var="titulo">
                                    <th class="ui-state-default" style="width: 20px">
                                        <div class="verticalText">#{titulo}</div>
                                    </th>
                                </c:forEach>
                            </tr>
                        </thead>
                        <tbody>
                            <c:forEach items="#{tablaTestBean.filas}" var="fila" varStatus="filaStatus">
                                <tr>
                                    <td>
                                        #{fila}
                                    </td>
                                    <c:forEach items="#{tablaTestBean.titulos}" var="columna" varStatus="colStatus">
                                        <td>
                                            <p:selectBooleanCheckbox value="#{tablaTestBean.checks[filaStatus.index][colStatus.index]}" >
                                                <p:ajax process="@this" update="@this" global="false" />
                                            </p:selectBooleanCheckbox>
                                        </td>
                                    </c:forEach>
                                </tr>
                            </c:forEach>

                        </tbody>

                    </table>
                </div>
            </div>

            <div class="botonera">
                <p:commandButton value="Mostrar" action="#{tablaTestBean.imprimir()}" ajax="false" />
            </div>

        </h:form>

    </ui:define>
</ui:composition>
